<template>
  <!-- 添加或修改工序对话框 -->
  <el-dialog :title="pd.title" v-model="pd.open" width="500px" append-to-body>
    <el-form ref="processRef" :model="pd.form" :rules="pd.rules" label-width="80px">
      <el-form-item label="工序名称" prop="name">
        <el-input v-model="pd.form.name" placeholder="请输入工序名称" />
      </el-form-item>
      <el-form-item label="工艺类别" prop="treeId">
        <el-select v-model="pd.form.treeId" placeholder="请输入工艺类别" clearable>
            <el-option
            v-for="dict in wms_process_state"
            :key="dict.id"
            :label="dict.name"
            :value="dict.id"
            />
        </el-select>
        <!-- <el-input v-model="pd.form.treeId" placeholder="请输入工艺类别" /> -->
      </el-form-item>
      <el-form-item label="工艺要求" prop="attention">
        <el-input v-model="pd.form.attention" type="textarea" placeholder="请输入内容" />
      </el-form-item>
      <el-form-item label="是否启用" prop="enableFlag">
        <el-switch v-model="pd.form.enableFlag" active-value="0" inactive-value="1"></el-switch>
      </el-form-item>
      <el-form-item label="备注" prop="remark">
        <el-input v-model="pd.form.remark" type="textarea" placeholder="请输入内容" />
      </el-form-item>
    </el-form>
    <template #footer>
      <div class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="pd.open = false">取 消</el-button>
      </div>
    </template>
  </el-dialog>

</template>

<script setup name="ProcessCurd">
import { delProcess, addProcess, editProcess, } from "@/api/wms/process";
import {getCurrentInstance, reactive} from "vue";
const { proxy } = getCurrentInstance();
const {sys_is} = proxy.useDict('sys_is');
const {wms_process_state} = proxy.useDict('wms_process_state');
const emit = defineEmits(["ok"]);


const pd = reactive({
  title: "",
  open: false,
  form: {},
  operation: 0,
  queryParams: {
    pageNum: 1,
    pageSize: 10,
    name: null,
    treeId: null,
  },
  rules: {
    name: [
      { required: true, message: "工艺名称不能为空", trigger: "blur" }
    ],
    treeId: [
      { required: true, message: "工艺类别不能为空", trigger: "change" }
    ],
    enableFlag: [
      { required: true, message: "是否启用不能为空", trigger: "blur" }
    ],
  },
});

/** 提交按钮 */
function submitForm() {
   proxy.$refs["processRef"].validate(async valid => {
    debugger
     if (valid) {
      if (pd.operation == 1) {
        await addProcess(pd.form).then(response => {
          proxy.$modal.msgSuccess("新增成功");
        });
      } else if (pd.operation == 2){
        await editProcess(pd.form).then(response => {
          proxy.$modal.msgSuccess("修改成功");
        });
      }
      emit("ok",pd.form.treeId);
     }
       pd.open = false;
   });
}

// 表单重置
function reset() {
  pd.form = {
    id: null,
    name: null,
    treeId: null,
    attention: null,
    enableFlag: "0",
    remark: null,
  };
  pd.operation = 0;
  pd.title = "";
  proxy.resetForm("processRef");
}

//新增
function add() {
  reset();
  pd.form = {...pd.form};
  pd.title = "添加工序";
  pd.operation = 1;
  pd.open = true;
}

//update
function update(row) {
  reset();
  debugger
  pd.form = {...pd.form , ...row};
  pd.title = "修改工序";
  pd.operation = 2;
  pd.open = true;
}

//delete
function del(ids) {
  pd.operation = 3;
  proxy.$modal.confirm('是否确认删除工序编号为"' + ids + '"的数据项？').then(function () {
    return delProcess(ids);
  }).then(() => {
    proxy.$modal.msgSuccess("删除成功");
    emit("ok",pd.operation);
  }).catch(() => {
  });
}



//导出自定义方法供父组件使用
defineExpose({ add,update,del});

</script>
